<template>
    <view>
        <!-- pages/service/service.wxml -->
        <view class="topbox">
            <cu-custom :isShowicon="true" :isBack="true">
                <view slot="backText">返回</view>
                <view slot="content">客服</view>
            </cu-custom>
        </view>
        <view class="flex flex-direction align-center justify-center padding-top">
            <view>
                <label>客服电话：{{ tel ? tel : '18595686903' }}</label>
            </view>
            <view class="qrcode">
                <label>客服微信</label>
                <image :src="qrcode" mode="widthFix" @tap="showImg"></image>
            </view>
        </view>
    </view>
</template>

<script>
// pages/service/service.js
const _api = require('../../utils/api.js');
const apiurl = require('../../utils/apiurl/public.js');
export default {
    data() {
        return {
            avatar: null,
            qrcode: null,
            tel: null
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad(options) {
        this.getData();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {},
    methods: {
        getData() {
            //获取信息
            _api.get(apiurl.customer).then((res) => {
                console.log(res);
                if (res.data.code == 0) {
                    this.setData({
                        qrcode: res.data.data.qrcode,
                        avatar: res.data.data.avatar,
                        tel: res.data.data.tel
                    });
                }
            });
        },

        showImg() {
            uni.previewImage({
                current: '',
                urls: [this.qrcode],
                success(res) {
                    console.log('预览图片成功');
                },
                fail(err) {
                    console.log('预览图片失败', err);
                }
            });
        }
    }
};
</script>
<style>
/* pages/service/service.wxss */
page {
    background: #ffffff;
    padding-top: 110rpx;
}
.qrcode {
    width: 680rpx;
    height: 680rpx;
    text-align: center;
    margin-top: 30rpx;
}
.qrcode image {
    display: block;
    width: 300rpx;
    margin: 0 auto;
}
</style>
